{% extends 'LimsMainBundle::Layout/formLayout.html.twig' %}

{% block stylesheets %}
  {{ parent() }}
{% endblock %}

{% block javascripts %}
  {{ parent() }}
{% endblock %}

{% block content %}
    <div class=row> 
                
                <div class=col-md-6> 
                    <form id=validate method=POST action="javascript:alert('Form #validate submited');"> 
                        <div class=block> 
                            <div class=header> <h2>Default fileds</h2> 
                                <div class="side pull-right"> 
                                    <button class="btn btn-default btn-clean" onClick="clear_form('#validate')" type=button>Clear form</button> 
                                </div> 
                            </div> 
                            <div class="content controls"> 
                                <div class=form-row> 
                                    <div class=col-md-3>Login:</div> 
                                    <div class=col-md-9> 
                                        <input type=text class="validate[required,maxSize[8]] form-control"/> 
                                        <span class=help-block>Required, max size = 8</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                    <div class=col-md-3>Password:</div> 
                                    <div class=col-md-9> 
                                        <input type=password class="validate[required,minSize[5],maxSize[10]] form-control" id="password"/> 
                                        <span class=help-block>Required, min size = 5, max size = 10</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                    <div class=col-md-3>Confirm Password:</div> 
                                    <div class=col-md-9> 
                                        <input type=password class="validate[required,equals[password]] form-control"/> 
                                        <span class=help-block>Required, equals Password</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                    <div class=col-md-3>Age:</div> 
                                    <div class=col-md-4> 
                                        <input type=text class="validate[required,custom[integer],min[18],max[120]] form-control"/> 
                                        <span class=help-block>Required, integer, min value = 18, max = 120</span> 
                                    </div> 
                                    <div class="col-md-2 tar">Gender:</div> 
                                    <div class=col-md-3> 
                                        <div class=checkbox-inline> 
                                            <label> <input type=radio class=validate[required] name=gender value="1"/> Male </label> 
                                        </div> 
                                        <div class=checkbox-inline> 
                                            <label> <input type=radio class=validate[required] name=gender value="0"/> Famale </label> 
                                        </div> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                    <div class=col-md-3>Date of birth:</div> 
                                    <div class=col-md-9> 
                                        <input type=text class="validate[required,custom[date]] form-control"/> 
                                        <span class=help-block>Required, date YYYY-MM-DD</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                    <div class=col-md-3>Credit card:</div> 
                                    <div class=col-md-9> 
                                        <input type=text class="validate[required,creditCard] form-control"/> 
                                        <span class=help-block>Required, credit card number</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> <div class=col-md-3>Site:</div> 
                                    <div class=col-md-9> 
                                        <input type=text value=http:// class="validate[required,custom[url]] form-control"/> 
                                        <span class=help-block>Required, url</span> 
                                    </div> 
                                </div> 
                                <div class=form-row> 
                                            <div class=col-md-12> 
                                                <label class=checkbox> <label> 
                                                        <input type=checkbox class=validate[required] name=terms value="1"/> Yes, I accept your terms and conditions. </label> 
                                                </label> 
                                            </div> 
                                </div> 
                            </div> 
                            <div class=footer> 
                                <div class="side pull-right"> 
                                    <div class=btn-group> 
                                        <button class="btn btn-default" type=button onClick="$('#validate').validationEngine('hide')">Hide prompts</button> 
                                        <button class="btn btn-success" type=submit>Submit</button> 
                                    </div> 
                                </div> 
                            </div> 
                        </div> 
                    </form> 
                </div> 
                <div class=col-md-6> 
                    <form id=validate_custom method=POST action="javascript:alert('#validate_custom submited');"> <div class=block> <div class=header> <h2>Custom fields validation</h2> <div class="side pull-right"> <button class="btn btn-default btn-clean" onClick="clear_form('#validate_custom')" type=button>Clear form</button> </div> </div> <div class="content controls"> <div class=form-row> <div class=col-md-3>Select:</div> <div class=col-md-9> <select name=s_example class="validate[required] form-control"> <option value></option> <option value=1>Andorra</option> <option value=2>Antarctica</option> <option value=3>Ukraine</option> </select> <span class=help-block>Required</span> </div> </div> <div class=form-row> <div class=col-md-3>Checkbox:</div> <div class=col-md-9> <div class=checkbox-inline> <label> <input type=checkbox class="validate[required] form-control" name=vcheck value="1"/> Enabled </label> </div> <div class=checkbox-inline> <label> <input name=vcheck value=0 type=checkbox disabled=disabled class="validate[required]"/> Disabled </label> </div> </div> </div> <div class=form-row> <div class=col-md-3>Radio:</div> <div class=col-md-9> <div class=checkbox-inline> <label> <input type=radio class=validate[required] name=vradio value="1"/> Enabled </label> </div> <div class=checkbox-inline> <label> <input type=radio disabled=disabled class=validate[required] name=vradio value="0"/> Disabled </label> </div> </div> </div> <div class=form-row> <div class=col-md-3>Datepicker:</div> <div class=col-md-9> <input type=text class="validate[required] datepicker form-control"/> <span class=help-block>Required</span> </div> </div> <div class=form-row> <div class=col-md-3>Group required:</div> <div class=col-md-9> <input class="validate[groupRequired[payments]] form-control" type=text name=credit id=credit /> <span class=help-block>Any of group fields must be filled</span> </div> </div> <div class=form-row> <div class=col-md-3></div> <div class=col-md-9> <input class="validate[groupRequired[payments]] form-control" type=text name=paypal id=paypal /> <span class=help-block>Any of group fields must be filled</span> </div> </div> <div class=form-row> <div class=col-md-3>Condition required:</div> <div class=col-md-9> <input type=text name=creditcard id=creditcard placeholder="Credit card" class="form-control"/> </div> </div> <div class=form-row> <div class=col-md-3></div> <div class=col-md-9> <input class="validate[condRequired[creditcard]] form-control" type=text id=ccv name=ccv placeholder="CCV"/> <span class=help-block>This field is required if "Credit card" field is filled</span> </div> </div> </div> <div class=footer> <div class="side pull-right"> <div class=btn-group> <button class="btn btn-default" type=button onClick="$('#validate_custom').validationEngine('hide')">Hide prompts</button> <button class="btn btn-success" type=submit>Submit</button> </div> </div> </div> </div> </form> 
                </div> 
            </div>
{% endblock %}